<template>
	<view class="bodyWrap" :class="{'flexBox':isFlex}">
		<template v-if="isFlex">
			<view class="my-header"><slot name="header"/></view>
			<scroll-view class="my-main" @scrolltolower="loadingMore" scroll-y="true">
				<slot/>
				<uni-load-more :status="status" v-if="showLoading" />
			</scroll-view>
			<view class="my-footer"><slot name="footer"/></view>
		</template>
		<slot v-else/>
	</view>

</template>

<script>
	import {defineComponent,reactive,toRefs,onMounted,getCurrentInstance,computed,watch} from 'vue'
	import {onLoad,onShow} from '@dcloudio/uni-app'
	import { useStore } from 'vuex'
	import {setStorage,getStorage,toast} from '@/utils/common.js'
	import {login} from "@/api/base.js"
	export default defineComponent({
		components:{
			//cFooter
		},
		props:{
			isFlex:{
				type:Boolean,
				default:false
			},
			status:String,
			showLoading:{
				type:Boolean,
				default:false
			},
		},
		setup(props,context) {
			const store = useStore()
			const {proxy} = getCurrentInstance()
			
			const state = reactive({
				userInfo:computed(()=>store.state.base.userInfo),
			})
			onMounted(async()=>{
				const {token} = store.state.base.userInfo
				if(!token){
				   const res = await login()
				   if(res.code==200){
						store.commit('base/set_userInfo',res.data)
				   }else{
					   toast('非法访问')
				   } 
				}
			})
			
			const loadingMore = ()=>{
				console.log("-----loadingMore,加载更多----")
				context.emit('loadMore')
			}
			
			return {
				...toRefs(state),
			}
		}
	})
</script>

<style lang="scss">
	.bodyWrap{
		box-sizing: border-box;
		width: 750rpx;
		color: #000;
		padding: 0;
		font-size: 28rpx;
		&.flexBox{
			display: flex;
			flex-flow: column;
			position: fixed;
			z-index: 900;
			height: 100%;
			width: 100%;
			.my-main{
				flex: 1;
				overflow: hidden;
			}
		}
	}
</style>
